<template>
	<div class="mainContent spotOrderDetail">
		<div class="bread-nav">
			<span class="bread-item">销售管理</span>
			<span class="bread-icon">&gt;</span>
			<span class="bread-item">现货订单管理</span>
			<span class="bread-icon">&gt;</span>
			<span class="bread-item activeNavs" @click="backSpotOrder">现货订单</span>
			<span class="bread-icon">&gt;</span>
			<span class="bread-item">现货订单详情</span>
		</div>
		<!-- <pathTracking :path="Model.path" /> -->
		<div class="container">
			<!-- 一级tabs -->
			<el-tabs v-model="Model.activeTab" @tab-click="onTabChange">
				<el-tab-pane label="订单详情" name="1"></el-tab-pane>
				<el-tab-pane label="赠品管理" name="2"></el-tab-pane>
				<el-tab-pane label="支付记录" name="3"></el-tab-pane>
				<el-tab-pane label="发货记录" name="4"></el-tab-pane>
				<el-tab-pane label="接待记录" name="5"></el-tab-pane>
				<el-tab-pane label="补购记录" name="6"></el-tab-pane>
				<el-tab-pane label="售中记录" name="7"></el-tab-pane>
				<el-tab-pane label="售后记录" name="8"></el-tab-pane>
				<el-tab-pane label="操作日志" name="9"></el-tab-pane>
			</el-tabs>
			<div class="tabBox">
				<div class="detailsTabsBtn" v-show="Model.activeTab == 1 && Model.pageOrderStatus == 1">
					<p class="itemBtn" @click="review">审核</p>
				</div>
				<div class="detailsTabsBtn" v-show="Model.activeTab == 1 && Model.pageOrderStatus == 6">
					<p class="itemBtn" style="margin-left: 16px;" @click="newRepurchase">新建补购</p>
				</div>
				<div class="detailsTabsBtn" v-show="Model.activeTab==2">
					<p class="itemBtn" @click="toaddGift">添加赠品</p>
				</div>
				<div class="detailsTabsBtn" v-show="Model.activeTab==3">
					<p class="itemBtn" @click="toaddPay">添加支付记录</p>
				</div>

				<el-row class="detailTable">
					<el-form :inline="true">
						<el-col :sm="24" :md="12" :lg="8" :xl="6" v-for="(item,index) in Model.tabFormInline" :key="index">
							<el-form-item :label="item.label+'：'">{{item.value}}</el-form-item>
						</el-col>
					</el-form>
				</el-row>
				<div class="tabBoxStep">
					<el-steps :active="Model.refundStep.activeStep">
						<el-step :title="item.title" :description="item.description" v-for="(item,index) in Model.refundStep.step" :key="index"></el-step>
					</el-steps>
				</div>
				<el-row class="detailTable">
					<div class="detailTableItemTitle">
						<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
						<p class="text">订单基础信息</p>
						<img class="detailTableImgNormal" src="@/assets/img/icon_edit.png" @click="onDialogEdit(true,'tableFormInline')">
						<img class="detailTableImgNormal" :src="Model.detailTableFrom.src" alt="" @click="toggleTableDetail('detailTableFrom')">
					</div>
					<el-form :inline="true" v-show="Model.detailTableFrom.flag">
						<el-col :sm="24" :md="12" :lg="8" :xl="6" v-for="(item,index) in Model.tableFormInline" :key="index">
							<el-form-item v-if="item.label == '配送类型'" :label="item.label+'：'">{{item.value | shippingMethodFilters}}</el-form-item>
							<el-form-item v-else-if="item.label == '售中状态' " :label="item.label+'：'">{{item.value | InSaleStatusFilters}}</el-form-item>
							<el-form-item v-else-if="item.label == '支付状态'" :label="item.label+'：'">{{item.value | payStatusFilters}}</el-form-item>
							<el-form-item v-else :label="item.label+'：'">{{item.value}}</el-form-item>
						</el-col>
					</el-form>
				</el-row>
				<!-- **********************************************               tab1  订单详情                 ************************************** -->
				<div v-show="Model.activeTab==1">
					<!-- 用户资料 -->
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">用户资料</p>
							<img class="detailTableImgNormal" src="@/assets/img/icon_edit.png" @click="onDialogEdit(true,'tableFormUserMsg')">
							<img class="detailTableImgNormal" :src="Model.detailTableFrom2.src" alt="" @click="toggleTableDetail('detailTableFrom2')">
						</div>
						<el-form :inline="true" v-show="Model.detailTableFrom2.flag">
							<el-col :sm="24" :md="12" :lg="8" :xl="6" v-for="(item,index) in Model.tableFormUserMsg" :key="index">
								<el-form-item v-if="item.label == '恋爱属性'" :label="item.label+'：'">{{item.value | sexTypeFilters}}</el-form-item>
								<el-form-item v-else :label="item.label+'：'">{{item.value}}</el-form-item>
							</el-col>
                            <el-col class="loveDeclaration">
								<el-form-item label="爱的礼物宣言：">{{Model.loveDeclaration}}</el-form-item>
							</el-col>
						</el-form>
					</el-row>
					<!-- 收货地址 （只在选择快递时） -->
					<el-row class="detailTable" v-if="Model.shippingMethod == 0">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">收货地址</p>
							<img class="detailTableImgNormal" src="@/assets/img/icon_edit.png" @click="openDialogAddress()">
							<img class="detailTableImgNormal" :src="Model.detailTableFrom3.src" alt="" @click="toggleTableDetail('detailTableFrom3')">
						</div>
						<el-form :inline="true" v-show="Model.detailTableFrom3.flag">
							<el-col :sm="24" :md="12" :lg="8" :xl="6" v-for="(item,index) in Model.saleAddressData" :key="index">
								<el-form-item v-if="item.label == '收件地址类型'" :label="item.label+'：'">{{item.value | addressTypeFilter}}</el-form-item>
								<el-form-item v-else :label="item.label+'：'">{{item.value}}</el-form-item>
							</el-col>
						</el-form>
					</el-row>
					<!-- 自提地址 （只在选择自提时） -->
					<el-row class="detailTable" v-if="Model.shippingMethod == 1">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">自提地址</p>
							<img class="detailTableImgNormal" src="@/assets/img/icon_edit.png" @click="Model.onDialogself = true">
							<img class="detailTableImgNormal" :src="Model.detailTableFrom4.src" alt="" @click="toggleTableDetail('detailTableFrom4')">
						</div>
						<el-form :inline="true" v-show="Model.detailTableFrom4.flag">
							<el-col :sm="24" :md="12" :lg="8" :xl="6" v-for="(item,index) in Model.saleAddressSelfData" :key="index">
								<el-form-item :label="item.label+'：'">{{item.value}}</el-form-item>
							</el-col>
						</el-form>
					</el-row>
					<!-- 订单商品明细 -->
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">订单商品明细</p>
							<img class="detailTableImgNormal" :src="Model.tab1TableDetail1.src" alt="" @click="toggleTableDetail('tab1TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab1TableDetail1.flag">
							<el-table stripe :data="Model.tab1TableData" border show-summary :summary-method="getSummaries"
							 @selection-change="handleSelectionChange">
								<el-table-column type="index" align="center" width="50" label="序号" fixed></el-table-column>
								<el-table-column align="center" v-for="(item,index) in Model.tab1TableHeader" :key="index" :prop="item.prop"
								 :label="item.label" :width="item.width">
								</el-table-column>
								<el-table-column fixed="right" align="center" :label="$t('common.handleOption')" width="180">
									<template slot-scope="scope">
										<div class="btnGroup">
											<!-- 订单状态为待发货或者待提货，商品有加急、发起售中变更、发起退款 -->
											<div v-if="Model.pageOrderStatus == '2' ||Model.pageOrderStatus == '3'">
												<!-- <div v-if="!scope.row.urgent" class="operate-btn" @click="onItemExpedited(scope.row)">加急</div> -->
												<div v-if="scope.row.aftersaleType == '0' " class="operate-btn" @click="onOrderChange(scope.row)">发起变更</div>
												<div v-if="scope.row.aftersaleType == '0' " class="operate-btn" @click="onItemRefund(scope.row)">发起退款</div>
											</div>
											<!-- 订单状态为待收货、已完成，商品有发起售后按钮 -->
											<div v-if="Model.pageOrderStatus == '5' ||Model.pageOrderStatus == '6'">
												<div v-if="scope.row.aftersaleType == '0' " class="operate-btn" @click="onOrderAfter(scope.row)">发起售后</div>
											</div>
											<div v-if="scope.row.aftersaleType == '10' || scope.row.aftersaleType == '20'" class="operate-btn" @click="onItemChangeLog(scope.row)">查看变更记录</div>
											<div v-if="scope.row.aftersaleType == '30' || scope.row.aftersaleType == '40' || scope.row.aftersaleType == '50'"
											 class="operate-btn" @click="onItemChangeLog(scope.row)">查看售后记录</div>
										</div>
									</template>
								</el-table-column>
							</el-table>
						</div>
						<div class="payInfo">
							<div class="clearfix">
								<div class="compute">
									<div class="flex">
										<!-- 币种 -->
										<div class="currency">币种：{{Model.payInfo.currency}}</div>
										<!-- 商品件数 -->
										<div class="commodityNumber">订单共{{Model.totleGoodCount}}件商品</div>
										<div class="commoditity">
											<ul>
												<li class="payItem" v-for="(item,index) in Model.payInfo.commodity">
													<span class="label">{{item.label}}</span>
													<span class="value">{{item.value}}</span>
												</li>
											</ul>
										</div>
									</div>
								</div>
							</div>
							<div class="clearfix">
								<div class="total">
									<div class="flex">
										<div class="commoditity">
											<ul>
												<li class="payItem" v-for="(item,index) in Model.payInfo.total">
													<span class="label">{{item.label}}</span>
													<span class="value price">{{item.value}}</span>
												</li>
											</ul>
										</div>
									</div>
								</div>
							</div>

						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab2   赠品管理                ************************************** -->
				<div v-show="Model.activeTab==2">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">附赠品列表</p>
							<img class="detailTableImgNormal" :src="Model.tab2TableDetail1.src" alt="" @click="toggleTableDetail('tab2TableDetail1')">
						</div>
						<div class="formInline">
							<el-form :inline="true" class="demo-form-inline">
								<el-form-item label="特殊申请赠品原因">:{{Model.specialReason}}</el-form-item>
							</el-form>
						</div>
						<div class="detailTableDetail" v-show="Model.tab2TableDetail1.flag">
							<el-table :data="Model.tab2TableData1" border show-summary style="width: 100%;max-height:550px"
							 @selection-change="handleSelectionChange">
								<el-table-column type="index" align="center" width="50" label="序号" fixed></el-table-column>
								<el-table-column v-for="(item,index) in Model.tab2TableHeader1" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
								<el-table-column fixed="right" align="center" :label="$t('common.handleOption')">
									<template slot-scope="scope">
										<div class="btnGroup">
											<div class="operate-btn" @click="deleteGift(scope.row)">删除</div>
										</div>
									</template>
								</el-table-column>
							</el-table>
						</div>
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">附赠品收货地址</p>
							<img class="detailTableImgNormal" :src="Model.tab2TableDetail2.src" alt="" @click="toggleTableDetail('tab2TableDetail2')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab2TableDetail2.flag">
							<el-table :data="Model.tab2TableData2" border style="width: 100%;max-height:550px" @selection-change="handleSelectionChange">
								<el-table-column v-for="(item,index) in Model.tab2TableHeader2" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
								<el-table-column fixed="right" align="center" :label="$t('common.handleOption')">
									<template slot-scope="scope">
										<div class="btnGroup">
											<div class="operate-btn" @click="adressEdit">编辑</div>
										</div>
									</template>
								</el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab3    支付记录               ************************************** -->
				<div v-show="Model.activeTab==3">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">收款记录</p>
							<img class="detailTableImgNormal" :src="Model.tab3TableDetail1.src" alt="" @click="toggleTableDetail('tab3TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab3TableDetail1.flag">
							<el-table :data="Model.tab3TableData1" border stripe max-height="550" @selection-change="handleSelectionChange">
								<el-table-column align="center" prop="serialNumber" label="支付流水号" width="100"></el-table-column>
								<el-table-column v-for="(item,index) in Model.tab3TableHeader1" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
								<el-table-column align="center" label="财务确认">
									<template slot-scope="scope">
										<div>{{scope.row.status | financeFilter}}</div>
									</template>
								</el-table-column>
								<el-table-column align="center" label="支付方式">
									<template slot-scope="scope">
										<div>{{scope.row.paymentMethod | paymentMethodFilter}}</div>
									</template>
								</el-table-column>
								<el-table-column align="center" label="sap过账">
									<template slot-scope="scope">
										<div>{{scope.row.posting | spaPostingFilter}}</div>
									</template>
								</el-table-column>
								<el-table-column align="center" fixed="right" :label="$t('common.handleOption')">
									<template slot-scope="scope">
										<div class="btnGroup">
											<div v-if="scope.row.status == 0 && scope.row.payStatus != 2" class="operate-btn" @click="payObsolete(scope.row)">作废</div>
											<div v-if="scope.row.status == 0 && scope.row.payStatus == 2" class="operate-btn" style="cursor: not-allowed;background-color: #ccc;">已作废</div>
										</div>
									</template>
								</el-table-column>
							</el-table>
						</div>
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">退款记录</p>
							<img class="detailTableImgNormal" :src="Model.tab3TableDetail2.src" alt="" @click="toggleTableDetail('tab3TableDetail2')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab3TableDetail2.flag">
							<el-table :data="Model.tab3TableData2" border stripe max-height="550" @selection-change="handleSelectionChange">
								<el-table-column v-for="(item,index) in Model.tab3TableHeader2" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab4    发货记录               ************************************** -->
				<div v-show="Model.activeTab==4">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">发货记录</p>
							<img class="detailTableImgNormal" :src="Model.tab4TableDetail1.src" alt="" @click="toggleTableDetail('tab4TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab4TableDetail1.flag">
							<el-table :data="Model.tableData" border show-summary style="width: 100%;max-height:550px" @selection-change="handleSelectionChange">
								<el-table-column align="center" prop="origin" label="时间" width="100"></el-table-column>
								<el-table-column align="center" prop="deliveryTime" label="操作类型" width="120"></el-table-column>
								<el-table-column align="center" prop="deliveryTime2" label="操作人" width="120"></el-table-column>
								<el-table-column align="center" prop="qcFinishTime" label="操作记录"></el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab5    接待记录               ************************************** -->
				<div v-show="Model.activeTab==5">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">接待记录</p>
							<img class="detailTableImgNormal" :src="Model.tab4TableDetail1.src" alt="" @click="toggleTableDetail('tab4TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab4TableDetail1.flag">
							<el-table :data="Model.tab5TableData" border show-summary style="width: 100%;max-height:550px" @selection-change="handleSelectionChange">
								<el-table-column align="center" fixed="left" label="接待单号">
									<template slot-scope="scope">
										<el-button type="text" @click="toCrmDetial(scope.row)"><a class="detial-link">{{scope.row.followId}}</a></el-button>
									</template>
								</el-table-column>
								<el-table-column v-for="(item,index) in Model.tab5TableHeader" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab6    补购记录               ************************************** -->
				<div v-show="Model.activeTab==6">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">补购订单信息</p>
							<img class="detailTableImgNormal" :src="Model.tab4TableDetail1.src" alt="" @click="toggleTableDetail('tab4TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab4TableDetail1.flag">
							<el-table :data="Model.tab6TableData" border show-summary style="width: 100%;max-height:550px" @selection-change="handleSelectionChange">
								<el-table-column v-for="(item,index) in Model.tab6TableHeader" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab7    售中记录               ************************************** -->
				<div v-show="Model.activeTab==7">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">订单售中记录</p>
							<img class="detailTableImgNormal" :src="Model.tab4TableDetail1.src" alt="" @click="toggleTableDetail('tab4TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab4TableDetail1.flag">
							<el-table :data="Model.tab7TableData" border style="width: 100%;max-height:550px" @selection-change="handleSelectionChange">
								<el-table-column label="售中单号" align="center" width="180">
									<template slot-scope="scope">
										<el-button type="text" @click="toInsaleDetial(scope.row)"><a class="detial-link">{{scope.row.saleNumber}}</a></el-button>
									</template>
								</el-table-column>
								<el-table-column v-for="(item,index) in Model.tab7TableHeader" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab8    售后记录               ************************************** -->
				<div v-show="Model.activeTab==8">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">订单售后记录</p>
							<img class="detailTableImgNormal" :src="Model.tab4TableDetail1.src" alt="" @click="toggleTableDetail('tab4TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab4TableDetail1.flag">
							<el-table :data="Model.tab8TableData" border style="width: 100%;max-height:550px" @selection-change="handleSelectionChange">
								<el-table-column label="售后单号" align="center" width="180">
									<template slot-scope="scope">
										<el-button type="text" @click="toAftersaleDetial(scope.row)"><a class="detial-link">{{scope.row.saleNumber}}</a></el-button>
									</template>
								</el-table-column>
								<el-table-column v-for="(item,index) in Model.tab8TableHeader" :key="index" :prop="item.prop" :label="item.label"
								 :width="item.width" align="center">
								</el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>
				<!-- **********************************************               tab9    操作日志              ************************************** -->
				<div v-show="Model.activeTab==9">
					<el-row class="detailTable">
						<div class="detailTableItemTitle">
							<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
							<p class="text">订单操作日志</p>
							<img class="detailTableImgNormal" :src="Model.tab4TableDetail1.src" alt="" @click="toggleTableDetail('tab4TableDetail1')">
						</div>
						<div class="detailTableDetail" v-show="Model.tab4TableDetail1.flag">
							<el-table :data="Model.tab9TableData" border max-height="550" @selection-change="handleSelectionChange">
								<el-table-column align="center" prop="createTime" label="时间" width="100"></el-table-column>
								<el-table-column align="center" prop="type" label="操作类型" width="120"></el-table-column>
								<el-table-column align="center" prop="createBy" label="操作人" width="120"></el-table-column>
								<el-table-column align="center" prop="record" label="操作记录"></el-table-column>
							</el-table>
						</div>
					</el-row>
				</div>


			</div>
		</div>
		<!-- 修改弹框 -->
		<el-dialog :visible.sync="Model.editDialogFlag" top="100px" class="viewDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">编辑</div>
			</div>
			<div style="padding:30px;background: #fff;">
				<el-form ref="form" label-width="120px" size="small">
					<el-form-item v-if="item.label == '配送类型' " label="配送类型" v-for="(item,index) in Model.editDialogFormData" :key="index">
						<el-select v-model="item.value" @change="selectDeliveryType">
							<el-option label="快递" :value="0"></el-option>
							<el-option label="自提" :value="1"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item v-show="!item.disabled" v-else-if="item.label == '恋爱属性' " :label="item.label">
						<el-input :value="item.value | sexTypeFilters"></el-input>
					</el-form-item>
					<el-form-item v-show="!item.disabled" v-else-if="item.label == '支付状态' " :label="item.label">
						<el-input :value="item.value | payStatusFilters"></el-input>
					</el-form-item>
					<el-form-item v-show="!item.disabled" v-else-if="item.label == '真爱日期' || item.label == '用户期望自提时间'" :label="item.label">
						<el-date-picker type="date" value-format="yyyy-MM-dd" v-model="item.value"></el-date-picker>
					</el-form-item>
					<el-form-item v-show="!item.disabled" v-else :label="item.label">
						<el-input v-model="item.value"></el-input>
					</el-form-item>
				</el-form>
				<div class="viewDialogFooter">
					<div class="viewDialogFooterSure" @click="saleOrderSave">保存</div>
					<div class="viewDialogFooterCancel" @click="onDialogEdit(false,'tableFormInline')">取消</div>
				</div>
				<p v-if="Model.tipsDeliveryType" class="tips">由于配送类型更改，信息不全，稍后请补充填写对应的配送信息</p>
			</div>
		</el-dialog>
		<!-- 修改收货地址 -->
		<el-dialog :visible.sync="Model.onDialogAddress" top="100px" class="viewDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">编辑订单收货信息</div>
			</div>
			<div style="background: #fff;">
				<el-form ref="form" label-width="120px" size="small">
					<el-form-item label="短信通知手机">
						<el-input v-model="Model.userAddressMsg.messagePhone"></el-input>
					</el-form-item>
					<el-form-item label="是否新建地址">
						<el-radio-group v-model="Model.userAddressMsg.isNewAddress">
							<el-radio :label="true">是</el-radio>
							<el-radio :label="false">否</el-radio>
						</el-radio-group>
					</el-form-item>
					<div v-if="Model.userAddressMsg.isNewAddress">
						<el-form-item label="收件人姓名">
							<el-input v-model="Model.userAddressMsg.recipientName"></el-input>
						</el-form-item>
						<el-form-item label="收件人手机号">
							<el-input v-model="Model.userAddressMsg.recipientPhone"></el-input>
						</el-form-item>
						<el-form-item label="收件地址类型">
							<el-radio-group v-model="Model.userAddressMsg.addressType">
								<el-radio :label="1">大陆</el-radio>
								<el-radio :label="2">海外</el-radio>
							</el-radio-group>
						</el-form-item>
						<el-form-item label="收件人地区">
							<el-cascader :options="Model.options" @active-item-change="handleItemChange" @change="changecascards" :props="Model.props"
							 v-model="Model.userAddressMsg.addressArea"></el-cascader>
						</el-form-item>
						<el-form-item label="详细地址">
							<el-input v-model="Model.userAddressMsg.detailedAddress"></el-input>
						</el-form-item>
					</div>
					<div v-else>
						<el-form-item label="请选择地址">
							<div class="chooseAddress">
								<el-radio-group v-model="Model.checkedAddressOpt">
									<el-radio :label="item" v-for="(item,index) in Model.addressInfoList" :key="index">
										<a><span>{{item.name}}</span><span>{{item.phone}}</span><span v-if="item.defaultAddress">默认地址</span></a>
										<p>{{item.geographyProvince.provinceName}}{{item.geographyCity.cityName}}{{item.geographyArea.areaName}}{{item.address}}</p>
									</el-radio>
								</el-radio-group>
							</div>
						</el-form-item>
					</div>
				</el-form>
				<div class="viewDialogFooter">
					<div class="viewDialogFooterSure" @click="saleAddressSave">保存</div>
					<div class="viewDialogFooterCancel" @click="Model.onDialogAddress = false">取消</div>
				</div>
			</div>
		</el-dialog>
		<!-- 修改自提地址 -->
		<el-dialog :visible.sync="Model.onDialogself" top="100px" class="viewDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">编辑自提信息</div>
			</div>
			<div style="padding:30px;background: #fff;">
				<el-form ref="form" label-width="120px" size="small">
					<el-form-item label="自提店铺城市">
						<el-select class="input-cont" v-model="Model.userSelfLift.takeGoodsShopCity" @change="queryStore" filterable
						 placeholder="请输入内容">
							<el-option v-for="(city,index) in Model.allCities" :key="index" :label="city.cityName" :value="city.cityName">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="自提店铺">
						<el-select class="input-cont" v-model="Model.userSelfLift.takeGoodsShop" filterable placeholder="请输入内容">
							<el-option v-for="(store,index) in Model.cityStore" :key="index" :label="store.theNameOfTheStore" :value="store.theNameOfTheStore">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="自提时间">
						<el-date-picker class="input-cont" value-format="yyyy-MM-dd" v-model="Model.userSelfLift.time" type="date"
						 placeholder="选择日期"></el-date-picker>
					</el-form-item>
				</el-form>
				<div class="viewDialogFooter">
					<div class="viewDialogFooterSure" @click="saleaddressSelfSave">保存</div>
					<div class="viewDialogFooterCancel" @click="Model.onDialogself = false">取消</div>
				</div>
			</div>
		</el-dialog>



		<!-- 查看变更弹框 -->
		<el-dialog :visible.sync="Model.orderChangeDialog" top="100px" class="orderChangeDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">商品变更明细</div>
			</div>
			<div style="padding:30px;background: #fff;">
				<el-table :data="Model.tab1ChangeTableData" border>
					<el-table-column align="center" type="index" width="50" label="序号" fixed></el-table-column>
					<el-table-column v-for="(item,index) in Model.tab1ChangeHeader" :key="index" :prop="item.prop" :label="item.label"
					 :width="item.width" align="center">
					</el-table-column>
				</el-table>
			</div>
		</el-dialog>
		<!-- 发起售后操作 弹框 -->
		<el-dialog :visible.sync="Model.orderAfterDialog" top="100px" class="orderAfterDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">发起售后操作</div>
			</div>
			<div class="viewDialogTitle">
				<span class="title">请选择售后类型</span>
				<el-radio v-model="Model.afterType" label="1">退货退款</el-radio>
				<el-radio v-model="Model.afterType" label="2">常规售后</el-radio>
				<el-radio v-model="Model.afterType" label="3">升级换款</el-radio>
				<div class="btnGroup">
					<div class="item" @click="comfirmAfter">确认</div>
					<div class="item cancel" @click="Model.orderAfterDialog = false">取消</div>
				</div>
			</div>
		</el-dialog>
		<!-- 添加赠品 -->
		<el-dialog title :visible.sync="Model.addGiftDialog" class="addGiftDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">添加赠品</div>
			</div>
			<div style="height:100%;overflow-y: auto; padding-bottom: 80px; box-sizing: border-box;">
				<el-form ref="form" v-model="Model.addGiftDialogit" class="giftReason">
					<el-form-item label="请输入特殊申请赠品原因：">
						<el-input v-model="Model.addGiftDialogit.reason"></el-input>
					</el-form-item>
				</el-form>
				<advancedSearch :option="Model.filterOption1" @getChild="showChild" @onSearch="toSearch" @onClear="toClear"
				 @onExport="toExport"></advancedSearch>
				<div class="tables">
					<p class="dialogShopTitle">赠品列表</p>
					<el-table stripe :data="Model.tableDataDialog" :row-style="selectedHighlight" @selection-change="handleSelectionChange">
						<el-table-column type="selection" fixed="left" align="center" width="50">
						</el-table-column>
						<el-table-column v-for="(item,index) in Model.tab1ChangeHeader2" align="center" :key="item.prop" :prop="item.prop"
						 :label="item.label" :width="item.width">
						</el-table-column>
					</el-table>
				</div>
				<div style="background: #fff;">

					<div class="viewDialogFooter">
						<div class="viewDialogFooterSure" @click="sureAddgift">添加</div>
						<div class="viewDialogFooterCancel" @click="Model.addGiftDialog = false">取消</div>
					</div>
				</div>
			</div>
		</el-dialog>
		<!-- 编辑 赠品地址 -->
		<el-dialog :visible.sync="Model.adressDialog" top="100px" class="adressDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">编辑收货地址</div>
			</div>
			<div style="background: #fff;">
				<el-form ref="form" v-model="Model.adressDialogit">
					<el-form-item label="收件人姓名：">
						<el-input v-model="Model.adressDialogit.recipientName"></el-input>
					</el-form-item>
					<el-form-item label="联系电话：">
						<el-input v-model="Model.adressDialogit.recipientPhone"></el-input>
					</el-form-item>
					<el-form-item label="收件人地址：">
						<el-input v-model="Model.adressDialogit.detailedAddress"></el-input>
					</el-form-item>
				</el-form>
				<div class="viewDialogFooter">
					<div class="viewDialogFooterSure" @click="ToSaveadress">确定</div>
					<div class="viewDialogFooterCancel" @click="Model.adressDialog = false">取消</div>
				</div>
			</div>
		</el-dialog>
		<!-- 支付弹框 -->
		<el-dialog :visible.sync="Model.dialogFormVisible" top="100px" class="viewPayDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">添加收款明细</div>
			</div>
			<div style="padding:30px;background: #fff;">
				<el-form :model="Model.dialogForm">
					<el-form-item label="支付方式：">
						<el-select size="small" v-model="Model.dialogForm.paymentMethod" placeholder="请选择支付方式" style="width:200px">
							<el-option label="支付宝" value="1"></el-option>
							<el-option label="现金" value="2"></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="流水号：">
						<el-input size="small" v-model="Model.dialogForm.serialNumber"></el-input>
					</el-form-item>
					<el-form-item label="支付金额：">
						<el-input size="small" v-model="Model.dialogForm.payMoney"></el-input>
					</el-form-item>
					<el-form-item label="支付日期：">
						<el-date-picker size="small" v-model="Model.dialogForm.createTime" type="datetime" placeholder="选择日期时间" style="width:200px">
						</el-date-picker>
					</el-form-item>
				</el-form>
				<div class="viewDialogFooter">
					<div class="viewDialogFooterSure" @click="comfirmPay">确定</div>
					<div class="viewDialogFooterCancel" @click="Model.dialogFormVisible = false">取消</div>
				</div>
			</div>
		</el-dialog>

	</div>
</template>

<script>
	import pathTracking from "@/components/common/pathTracking";
	import pagination from "@/components/common/pagination.vue";
	import advancedSearch from "@/components/common/filter/advancedSearch";
	import {
		getDateString
	} from "@/assets/js/common.js";
	import Model from "./model.js";
	import Controller from "./controller.js";
	export default {
		name: "purchase",
		mixins: [Model, Controller],
		components: {
			advancedSearch,
			pagination,
			pathTracking
		}
	};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
	@import "./index.less";
</style>
<style>
	.spotOrderDetail .orderChangeDialog .el-dialog {
		width: 70%;
		height: 70%;
	}
</style>
